<template>
	<view>
		<view class="" @click="setPopup(true)">
			<slot></slot>
		</view>
		<uni-popup ref="popupRef" type="bottom">
			<view class="rounded-t-md bg-white">
				<view class="flex justify-between">
					<view class="flex-1 text-center py-10">
						<text>取消</text>
					</view>
					<view class="flex-1 text-center py-10" @click="onSave">
						<text class="text-[#329EFF]">确认</text>
					</view>
				</view>
				<picker-view :value="value" @change="bindChange" style="height:600rpx">
					<picker-view-column v-for="e,i in columns">
						<view class="text-center" v-for="(item,index) in e" :key="index">{{item}}</view>
					</picker-view-column>
				</picker-view>
			</view>
		</uni-popup>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	const value = ref()
	const popupRef = ref()
	const setPopup = (show) => {
		if (show) popupRef.value.open()
		else popupRef.value.close()
	}
	const columns = [
		[1, 2, 3, 4, 5, 6, 7, 8]
	]
	const bindChange = (val) => {
		console.log(val);
	}
	const onSave = () => {
		console.log(value.value);
	}
</script>

<style lang="less">

</style>